Add listview and listviewitem roles to support interactive lists of interactive widgets, cards, tiles, etc. #2328
Conversation
✅ Deploy Preview for wai-aria ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
mcking65
changed the title
|
How do I find the lines that are generating the failures? When I go to the details for the check, I can't find where the actual failure is shown. |
|
@mcking65 Your PR has introduced a lot of spacing changes which makes it very difficult to evaluate the problem. |
| A <code>listview</code> can scroll in any direction as users move focus.</code> | ||
| Items can be arranged in a single column, a single row, or in multiple columns or rows. | ||
| Authors SHOULD indicate whether the order of the collection is presented horizontally or vertically with <pref>aria-orientation</pref>. | ||
| For example, if a set of twenty cards is presented in a vertical list that is wrapped into five columns that contain four cards, authors SHOULD set <pref>aria-orientation</pref> to <code>vertical</code>. |
There was a problem hiding this comment.
IMO: The value "vertical" would inform screen reader users only that they can use up and down arrow keys to muve through the list. To signal to the users that they can move vertically and horizontally - such as the case in a dashboard - would require a new value for "aria-orientation" in addition to vertical and horizontal. It could be "gridlike", "all" or something similar.
There was a problem hiding this comment.
My first thought was that this could provide support for languages that are vertical. I wonder if aria-orientation could have a default value of any (or similar) but could also accept author provided values of horizontal or vertical?
Closes #2036
Related issues:
Test, Documentation and Implementation tracking
Once this PR has been reviewed and has consensus from the working group, tests should be written and issues should be opened on browsers. Add N/A and check when not applicable.
Preview (#listview) (#listviewitem) | Diff